import React, { useEffect, useState } from 'react'
import styles from './style.less'
import { Card, message, Modal, Radio, Tag } from 'antd';
import Editor from './editor';
import { deleteQuestion } from '../service';
import qs from 'qs';
import { runCase } from '@/pages/teacher/question/service';
import { excute } from '../../program/service';

export type Props = {
    data: any;
    idx: number;
    questionResults?: any;
    testId?: any;
    studentId?: any
};

const Program: React.FC<Props> = (props) => {
    const { data, idx, questionResults, studentId, testId } = props
    const { content, questionId, answer } = data
    const questionContent = JSON.parse(content);
    const [values, setValues] = useState()
    const [answerVisvible, setAnswerVisvible] = useState(false)
    const isRight = false

    // {
    //     answer ? "" : useEffect(() => {
    //         questionResults.splice(idx, 1, { questionId: questionId, result: "", testId: testId })
    //         console.log(questionResults, '不是会执行这里嘛');
    //     }, [])
    // }

    const onChanges = (e: any) => {
        console.log(e, 'value');
        setValues(e);
        questionResults?.splice(idx, 1, { questionId: questionId, result: e, testId: testId })
    }

    const check = () => {
        setAnswerVisvible(true)
    }

    const handleAnswerCancel = () => {
        setAnswerVisvible(false)
    }


    const deleteQuestions = async () => {
        const res = await deleteQuestion(qs.stringify({ questionIds: questionId, testId: testId }));
        if (res.code === 200) {
            message.success('删除成功')
        }
    }

    const runCode = async () => {
        const obj = {
            questionId: questionId,
            code: values
        }
        // const ress = await runCase(qs.stringify(obj))
        // if (ress.code === 300) {
        //     setTimeout(() => {
        //         runCode()
        //     }, 1000)
        // }
        // if (ress.code === 200) {
        //     message.success('运行成功')
        // }
        const res = await excute(qs.stringify(obj))
        if (res.code === 200) {
            message.success('运行成功')
        }
    }

    return (
        <>
            <Card>
                <Tag color="blue">{questionContent.title}</Tag>
                <li className={styles.programTitle}>{`${idx + 1}、${questionContent.body}`}</li>
                {answer ? '' : <span className={styles.testAnswer}><Tag color={'green'} className={styles.programAnswer} onClick={runCode}>运行代码</Tag></span>}
                {answer ? <span className={styles.testAnswer}><Tag color={'green'} className={styles.programAnswer} onClick={check}>查看答案</Tag></span> : ''}
                {answer ? <span className={styles.testDeleteAnswer}><Tag color={'red'} onClick={() => deleteQuestions()}>删除题目</Tag></span> : ''}
                <li className={styles.answer}>
                    <Editor
                        value={values}
                        onChange={onChanges}
                        isRightTheme={isRight}
                    />
                </li>
            </Card>
            <Modal title="答案" visible={answerVisvible} onCancel={handleAnswerCancel} onOk={handleAnswerCancel} width={'60%'}>
                <pre>{answer}</pre>
            </Modal>
        </>
    );
}

export default Program;
